前几天刷到小排老师的文章，他和 Claude Code 一起 Vibe Coding 实现社媒、内容创作自动化，将工具用到了极致。我突然意识到，AI 和人的创作关系正在变化。它不再是工具的延伸，而是让人能把灵感即时落地的伙伴——想到什么，就能立刻做出来

正好最近又看到一个很有意思的案例：博主 AI 进化论-花生做了一个叫小猫补光灯的 App。这款 App 的功能其实很简单，就是能够将手机屏幕设置为不同颜色的补光色卡，帮助女生在拍照的时候能获得更好的效果

但神奇的是，他作为一个不会写代码非工程师出身的人，只用 Cursor 花了 1 小时就把代码写完、第二天就通过 App Store 审核上线。上线后，他把作品发到小红书，几天内下载量就突破 3 万+

看完之后，我也想体验下这种让灵感瞬间落地的 Vibe Coding

正好有个点子，平时我会在网上订阅各种服务，比如百度网盘、网易云音乐之类的。为了弄清自己到底花了多少钱、都订了哪些服务、哪些快到期需要续费，我还特地在苹果的备忘录里做了个记录

那我干嘛不趁现在，直接把它做成一个 App 呢？好主意！

我理了下思路，打算照这个流程来开发我的第一个 iOS App：

1. 先把需求拆成小点，交给 GPT，生成初版的产品文档
2. Review 文档，按自己的想法让 GPT 优化，确认无误后继续
3. 把最终文档交给 Cursor，让它根据内容绘制 App 原型，并输出成 HTML 方便预览
4. Review 原型，根据审美和交互体验让 Cursor 调整细节
5. 把产品文档和原型一并交给 Cursor，让它帮我编写 App 代码
6. 在 Xcode 上编译、预览项目，遇到 bug 就修复
7. 最后持续小修小补，打磨体验

说干就干！接下来，我就按这七步节奏，和 Cursor 一起 Vibe Coding

首先，我把自己的需求梳理成几个关键点：

- 生成一份完整的订阅管理 App 的 PRD（产品需求文档）
- 要求简洁优雅，第一版只需达到 MVP（最小可行产品）标准
- 核心功能模块包括：订阅/买断管理、统计看板、设置同步等
- 为每个功能补充必要的数据字段，如服务名称、价格、周期、类型等

我把这段提示词丢给 GPT，请它帮我生成了一份产品文档，考虑到篇幅就不全贴了，这里就贴个图

GPT 生成的第一版产品文档整体上还行，但略显啰嗦——功能拆得特别细，字段定义齐全，连交互都给我写了一小半

我删掉了一些不必要的部分，比如过早定义的高级功能、重复的字段描述，还有一些不太符合我个人使用习惯的说明。我的目标其实很简单，做个能立刻用起来的 MVP，而不是一份看起来 “近乎无懈可击” 的产品文档

GPT 按我的修改意见重新生成了一版，把功能聚焦在三块：订阅管理、支出统计、应用设置

这一步其实挺有意思的，像是在教 AI 理解我的思考方式，希望它能“对上我的频率”

接下来，我把最终确认的产品文档交给 Cursor，让它根据文档绘制 App 原型，并输出成 HTML，方便我随时预览

我准备好的提示词大概长这样：

@SubTrack_PRD.md 请你根据该文档，帮我在 @index.html 中实现该 iOS App 的原型图

样式：
使用 SwiftUI + UserDefaults 开发所有原型界面。并且使用[Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/modality) 的设计风格

代码结构：
每个界面以独立 HTML 文件形式存储，例如 home.html、profile.html、 settings.html等。

index.html 作为主入口，不直接包含所有界面的完整代码，而是通过<iframe> 嵌入各界面文件，并在 index 页面中平铺展示所有页面，避免使用链接跳转。

真实感增强：
界面尺寸需模拟iPhone 15 Pro 的屏幕规格，并应用圆角设计，以贴近真实移动设备的外观。

把提示词丢给 Cursor 的那一刻，我就像按下了“魔法按钮”。几分钟后，HTML 原型就生成了——每个页面都按文档设计好，布局、圆角、尺寸都精准呈现，甚至可以直接在原型上预览交互效果

第一次看到文字描述瞬间变成交互界面，那种“灵感瞬间落地”的成就感，真让人上头

你还真别说，这个原型画得又快又好！不过，作为使用者，我还是得亲自把关，调整颜色、字体、间距，优化按钮和交互逻辑，让整个界面更符合我的审美和操作习惯

Cursor 很听话，我把修改意见丢给它，它几乎瞬间就能调整好。这个过程特别有意思：AI 为你的想法提供基本框架，我负责把“感觉”落在细节上，真正体会到什么叫人机共创

我迫不及待的最终的产品文档和原型一并交给 Cursor，让它帮我生成 App 的完整代码，这是提示词：

1. 请你参考 @prototype/ 下的所有原型图，完成 iOS App 的界面

2. 文档参考 @SubTrack_PRD.md

3. 需要使用 SwiftUI 和 UserDefaults 并遵循 MVVM 架构来实现整个 App

Cursor 写代码时，我心里还在感叹：“我连 Xcode 都没真正用过，现在居然在写 iOS 应用？”

几分钟之内，代码就自动成型——界面布局、功能逻辑、数据存储几乎全都覆盖。

第一次看到原型和文档被瞬间翻译成可运行代码的那种震撼，真的像是按下了“即刻实现”的开关。你只需要在 Xcode 打开项目，就能看到界面、点击交互、功能流程全部动起来

情况比我想象中顺利得多。我用的是 Claude Code Sonnet 4.5 模型，几乎没有 BUG，Cursor 基本按照原型和文档来开发，偶尔有些功能遗漏，但完全在可接受范围内

更有趣的是，生成的代码可读性很好，抽象层次清晰，我甚至有那么一瞬间，觉得它写的代码比同事写的读起来还舒服 :-）

这一步让我真切体会到 Vibe Coding 的魔力：想法落地，从文字到界面，再到可运行代码，几乎一步到位

完整应用在我的手机上演示：

这是 Cursor 和我 Vibe Coding 成果。看了 SwiftUI 的代码，我一下子就明白了它的思路，跟 Vue 很像，都是 MVVM 架构，我一下子来了兴趣，顺便补充了一些 SwiftUI 的基础知识，现在 AI 写的 SwiftUI 代码我也能自己改了，我想这就是会写代码工程师出身的人的优势之一

毋庸置疑，AI 编程将会是这个时代最重要的杠杆之一

编程不再是少数人的技能，它让一个完全不会写代码的人，也能把想法迅速落地成 MVP，验证市场。在这个需求快速更迭的时代，它就是每个人手里的一根“创作杖”，比哈利波特的魔法棒还要实用

未来的创作者，不一定会写代码，但一定会与 AI 一起创作